<template>
  <el-card>
    <ul>
        <li><span>模板编号</span> <el-input style="width: 12vw" v-model.trim='mouldCode'></el-input></li>
      <li><span>模板名称</span> <el-input style="width: 12vw" v-model.trim='modelName'></el-input></li>
       <li>
            <span class="red">酬金科目：</span>
            <el-input
              :disabled="true"
              style="width: 15vw"
              v-model="subject"
            ></el-input>
            <i class="el-icon-folder-opened" @click="subjectGet"></i>
          </li>
      <li>
        模板生效时间
        <el-date-picker
          type="date"
          placeholder="选择起始日期"
          v-model.trim="startDate"
          value-format="yyyy-MM-dd"
        >
        </el-date-picker>
      </li>
      <li>
        模板失效时间
        <el-date-picker
          type="date"
          placeholder="选择结束日期"
          v-model.trim="endDate"
          value-format="yyyy-MM-dd"
        >
        </el-date-picker>
      </li>
      <li>
        酬金类型
        <el-radio label="放号类" v-model="radio"></el-radio>
        <el-radio label="终端类" v-model="radio"></el-radio>
        <el-radio label="数据业务" v-model="radio"></el-radio>
        <el-radio label="业务类" v-model="radio"></el-radio>
        <el-radio label="缴费类" v-model="radio"></el-radio>
         <el-radio label="激励类" v-model="radio"></el-radio>
        <el-radio label="考核类" v-model="radio"></el-radio>
      </li>
        <li>
            
          <el-dialog
            title="选择科目"
            :visible.sync="subjectVisible"
            width="50%"
            style="heigth: 500px"
          >
            <ul>
              <li v-for="item in resultSubjectArr" :key="item.id">
                <a
                  href=""
                  @click.prevent="getCourseId(item.courseName)"
                  >{{ item.courseName }}</a
                >
              </li>
            </ul>
            <span slot="footer" class="dialog-footer">
              <el-button @click="subjectVisible = false">取 消</el-button>
            </span>
          </el-dialog>
        </li>
    </ul>
    <div>
        <el-button type="primary" @click="add">
            新增
        </el-button>
    </div>
  </el-card>
</template>

<script>
export default {
  name: "model",
  data() {
    return {
      startDate: "",
      endDate: "",
      radio: "",
      subject:'',
      modelName:'',
      mouldCode:'',
      resultSubjectArr:[],
      subjectVisible:false
    };
  },
  methods:{
      add(){
          if(this.startDate==''||this.endDate==''||this.radio==''||this.modeCode==''||this.subject==""){
              this.$alert('请完整输入')
              return
          }
          this.$axios.post('api/mould/insert',{
            mouldCode:this.mouldCode,
            applyCourse:this.subject,
            mouldType:this.radio,
            beginTime:this.startDate,
            lastTime:this.endDate,
            mouldName:this.modelName
          }).then((res)=>{
              if(res.data.code>=200&&res.data.code<300){
               
                  this.$router.push(`/templateModel?modelId=${res.data.data}`)
              }
          }).catch((err)=>{
            this.$alert(err)
          })
      },
      subjectGet(){
      this.subjectVisible = true;
      this.$axios
        .get("api/course/selectAll ")
        .then((res) => {
          console.log(res);
          if (res.status >= 200 && res.status <= 300) {
            this.resultSubjectArr = res.data.data;
            
          }
        })
        .catch((err) => {
          this.$alert(err);
        });
      },
      getCourseId(name){
          this.subjectVisible=false
          this.subject=name
      }
  }
};
</script>

<style scoped>
* {
  margin: 5px;
  text-align: left;
}
li {
  list-style-type: none;
}
</style>